<template>
    <div class="secure">
        <div class="opt">
            <van-button plain type="primary" block @click="setPwdFn">设置密码</van-button>
        </div>
       <div class="opt">
            <van-button @click="logoutFn" type="danger" block>退出登录</van-button>
       </div>
       <div class="opt">
            <van-button type="warning" @click="backTo" block>返回</van-button>
       </div>
    </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router'
import { showConfirmDialog } from 'vant';


const $router = useRouter()

const backTo = ()=> {
    $router.go(-1)
}

// 退出登录
const logoutFn = () => {
    showConfirmDialog({
    title: '提示',
    message:
        '您确定要退出登录吗?',
    })
    .then(() => {
        // on confirm
        // console.log("确定")
        localStorage.removeItem("NICKNAME")
        localStorage.removeItem("AUTOTOKEN")
        setTimeout(()=>{
            $router.replace({path: '/login'})
        },150)
    })
    .catch(() => {
        // on cancel
        console.log("取消")
    });
}

// 设置密码
const setPwdFn = ()=> {
    $router.push({path: '/findpwd'})
}
</script>

<style lang="less">
@import '../../static/less/variable.less';
.secure {
    padding: @pad;
    margin-top: 20px;
    .opt {
        margin-bottom: 15px;
    }
}
</style>